<template>
    <div class="project-nav-container">
      <el-menu
      default-active="2"
      class="el-menu-vertical"
      @open="handleOpen"
      @close="handleClose">
        <el-submenu
        v-for="(hosItem,index) in multiDataPermissions" :key="index"
        :hospital_id="hosItem.hospital_id"
        :hospital_code="hosItem.hospital_code"
        :index="String((index+1))"
        >
          <template slot="title">
            <i class="el-icon-menu"></i>
            <span>{{hosItem.hospital_name}}</span>
          </template>

          <el-menu-item-group>
            <el-submenu
            v-for="(deparItem,index2) in hosItem.department_list" :key="index2"
            :department_id= "deparItem.department_id"
            :index="String((index+1)+'-'+(index2+1))"
            >
              <template slot="title">
                <i class="el-icon-s-grid"></i>
                <span>{{deparItem.department_name}}</span>
                </template>
              <el-menu-item
              v-for="(proItem,index3) in deparItem.project_list" :key="index3"
              :project_id="proItem.project_id"
              :project_type="proItem.project_type"
              :project_code="proItem.project_code"
              :index="String((index+1)+'-'+(index2+1)+'-'+(index3+1))"
              :data-index="(index+1)+'-'+(index2+1)+'-'+(index3+1)"
              @click="goToProjectHangle(proItem.project_id)"
              >
              {{proItem.project_name+` (${projectNum[proItem.project_id]||0})`}}
              </el-menu-item>
            </el-submenu>
          </el-menu-item-group>
        </el-submenu>
      </el-menu>
    </div>
</template>
<script>
  import bus from '@/utils/bus';
  export default {
    data() {
      return {
        projectId: this.$route.query.projectId
      };
    },
    props: {
      multiDataPermissions: {
        type: Array
      },
      projectNum: {
        type: Object
      }
    },
    mounted() {
      bus.$on('zTreeOnCheck', (value) => {
        console.log(value);
      });
    },
    methods: {
      goToProjectHangle(projectId) {
        let oldProjectId = this.$route.query.projectId;
        // console.log(projectId, oldProjectId);
        if (projectId !== Number(oldProjectId)) { // 当前url projectId !== 点击的病种id
          // this.$router.replace({ name: 'index', query: { projectId: projectId } });
        }
        this.$emit('getProjectIdData', projectId);
      },
      handleOpen(key, keyPath) {
        // console.log(key, keyPath);
      },
      handleClose(key, keyPath) {
        // console.log(key, keyPath);
      }
    },
    beforeRouteEnter(to, from, next) {
      console.log(to);
    }
  };
</script>
<style scoped lang="scss">
.project-nav-container{
  width: 100%;
  height: 100%;
  overflow-y: scroll;
  padding-top: 50px;
  .el-submenu .el-menu-item {
    height: 50px;
    line-height: 50px;
    padding: 0 45px;
    min-width: 200px;
  }
}
</style>
